<template>
	<Layout>
		<Form ref="queryForm" :model="dataToQuery" :label-width="125">
			<Row class="query-form">
				<Col span="8">
				<FormItem label="所属单位：">
					<cascaderDom ref="queryOrgCascader" @setOrgInfo="setOrgId" @setOrgname="setOrgName"
						:rootOrgId="companyId" class='query-form-el' :orgTree="true"></cascaderDom>
				</FormItem>
				</Col>
				<Col span="8">
				<FormItem label="人员名称：">
					<Input class='query-form-el' type='text' v-model='dataToQuery.userName' />
				</FormItem>
				</Col>
				<Col span="8" v-if="!switchFlag">
				<Button @click="switchQuery(true)" class="ivu-btn-switch" type="text">展开∨</Button>
				<Button @click="reset" class="ivu-btn-reset">重置</Button>
				<Button type="primary" class="ivu-btn-query" icon="md-search" @click="query">查询</Button>
				</Col>
				<Col span="8" v-else>
				<FormItem label='负责工作：'>
					<Select multiple v-model='dataToQuery.resWorks' class='query-form-el'>
						<Option value="1">安全</Option>
						<Option value="0">环保</Option>
					</Select>
				</FormItem>
				</Col>
			</Row>
			<Row v-show="switchFlag" class="query-form">
				<Col span="8">
				<FormItem label="文化程度：">
					<Select multiple v-model='dataToQuery.eduIds' :max-tag-count="2" class='query-form-el'>
						<Option v-for="item in educations" :value="item.codingCodeId" :key="item.codingCodeId"
							:lable="item.codingName">{{item.codingName }}
						</Option>
					</Select>
				</FormItem>
				</Col>
				<Col span="8">
				<FormItem label="专/兼职：">
					<Select multiple v-model='dataToQuery.isFullworks' class='query-form-el'>
						<Option value="1">专职</Option>
						<Option value="0">兼职</Option>
					</Select>
				</FormItem>
				</Col>
				<Col span="8">
				<FormItem label="职务或岗位分工：">
					<Select multiple v-model='dataToQuery.persitionIds' :max-tag-count="2" class='query-form-el'>
						<Option v-for="item in persitionIds" :value="item.codingCodeId" :key="item.codingCodeId">
							{{item.codingName }}
						</Option>
					</Select>
				</FormItem>
				</Col>
			</Row>
			<Row v-show="switchFlag" class="query-form">
				<!--<Col span="8">-->
				<!--<FormItem label="审批状态：">-->
					<!--<Select v-model='dataToQuery.ifApproval' class='query-form-el'>-->
						<!--<Option value="2">待提交</Option>-->
						<!--<Option value="0">待审批</Option>-->
						<!--<Option value="1">审批退回</Option>-->
						<!--<Option value="3">审批通过</Option>-->
					<!--</Select>-->
				<!--</FormItem>-->
				<!--</Col>-->
				<Col span="8" :offset="16">
				<Button @click="switchQuery(false)" class="ivu-btn-switch" type="text">收起∧</Button>
				<Button @click="reset" class="ivu-btn-reset">重置</Button>
				<Button type="primary" class="ivu-btn-query" icon="md-search" @click="query">查询</Button>
				</Col>
			</Row>
			<Row class="query-form">
				<Col span="24">
				<Button size="large" class="ivu-btn-add" icon="md-add" @click="addInfo">新增</Button>
				<Button type="primary" class="ivu-btn-add" :loading="buttonLoading" icon="md-cloud-download"
					@click="downloadFile">导出</Button>
				</Col>
			</Row>
		</Form>
		<Table ref='table' :height="tableHeight" no-data-text="没有查询到相关数据!" @on-selection-change='getSelectRows'
			:loading='pageStatus.loading' border :columns="columns1" :data="dataTable">
		</Table>
		<Row style="margin-right:10px;">
			<Col span="24">
			<Page style="float: right" :total="pagedata.total" :page-size="pagedata.pageSize" @on-change="pageChange"
				@on-page-size-change="pageSizeChange" :page-size-opts="pageSizeArray" show-total show-sizer
				show-elevator />
			</Col>
		</Row>
		<Modal title="安全环保管理人员信息表" :transfer=false :mask-closable="false" v-model="dialogShow" v-if="dataToView && dialogShow" :width=800
			:styles="{height:'559px'}" class-name='limit-height-dialog'>
			<Form ref="dialogForm" :class="mode === 'view'?'modal-view-detail':'modal-form'" :show-message="false"
				:model="dataToView" :rules="mode === 'view'?{} :ruleCustom"
				:label-position="mode === 'view'?'right':'top'" :label-width="mode === 'view'?130:null">
				<Row type="flex" justify="space-around" class="code-row-bg">
					<Col span="23">
					<FormItem label='所属二级集团：'>
						<div v-if="mode === 'view'">{{ dataToView.secGroupName }}</div>
						<Input v-else readonly class='query-form-el' placeholder="请填写所属二级集团" type='text'
							v-model='dataToView.secGroupName' />
						<Input v-show="false" class='query-form-el' placeholder="请填写所属二级集团" type='text'
							v-model='dataToView.secGroup' />
						<!--<cascaderDom v-else class="query-form-el" ref="secGroup"
                                         @setOrgInfo='(data)=>{cascaderDomIdChangeHandle(data,"secGroup");}'
                                         @setOrgname='(data)=>{cascaderDomNameChangeHandle(data,"secGroupName");}'
                                         :currentOrgId="dataToView.secGroup"
                                         :setCurrentName="{label:dataToView.secGroupName, value:dataToView.secGroup}"
                                         :orgTree="true" :root-org-id="-1"></cascaderDom>-->
						<!-- <Select v-else v-model='dataToView.secGroup' class='query-form-el'>
                                <Option v-for="item in secGroupNames" :value="item.orgId" :key="item.orgId">{{item.orgName }}</Option>
                            </Select>-->
					</FormItem>
					</Col>
				</Row>
				<Row type="flex" justify="space-around" class="code-row-bg">
					<Col span="23">
					<FormItem label='单位：' prop='staffOrgName'>
						<div v-if="mode === 'view'">{{ dataToView.staffOrgName }}</div>
						<!--<Input v-else readonly class='query-form-el' type='text' v-model='dataToView.staffOrgName'></Input>-->
						<cascaderDom v-else class="query-form-el" ref="secGroupId"
							@setOrgInfo='(data)=>{cascaderDomIdChangeHandle(data,"staffOrgId");}'
							@setOrgname='(data)=>{cascaderDomNameChangeHandle(data,"staffOrgName");}'
							:currentOrgId="dataToView.staffOrgId"
							:setCurrentName="{label:dataToView.staffOrgName, value:dataToView.staffOrgId}"
							:orgTree="true" :rootOrgId="companyId"></cascaderDom>
					</FormItem>
					</Col>
				</Row>
				<Row type="flex" justify="space-around" class="code-row-bg">
					<Col span="11">
					<FormItem label='人员姓名：' prop='userName'>
						<div v-if="mode === 'view'">{{ dataToView.userName }}</div>
						<!--<Input v-else class='query-form-el' placeholder="请填写人员" type='text' v-model='dataToView.userName'></Input>-->
						<!--<Input v-show="false" class='query-form-el' type='text' v-model='dataToView.userId'></Input>-->
						<Input type="text" v-else v-model="dataToView.userName">
						<!--@on-focus="model4=true"-->
						<Button slot="append" @click="model4=true" icon="ios-search"></Button>
						</Input>
						<Input type="text" v-show="false" v-model="dataToView.userId" />
					</FormItem>
					</Col>
					<Col span="11">
					<FormItem label='手机：' prop='cellPhone'>
						<div v-if="mode === 'view'">{{ dataToView.cellPhone }}</div>
						<Input v-else class='query-form-el' placeholder="请填写手机" v-model='dataToView.cellPhone'></Input>
					</FormItem>
					</Col>
				</Row>
				<Row type="flex" justify="space-around" class="code-row-bg">
					<Col span="11">
					<FormItem label='职务或岗位分工：' prop='persition'>
						<div v-if="mode === 'view'">{{ dataToView.persition }}</div>
						<!--<Input v-else class='query-form-el' placeholder="请填写职务或岗位分工" type='text' v-model='dataToView.persition'></Input>-->
						<Select v-else v-model='dataToView.persitionId' label-in-value
							@on-change="persitionIdAndPersition" class='query-form-el'>
							<Option v-for="item in persitionIds" :value="item.codingCodeId" :key="item.codingCodeId">{{
                                    item.codingName }}
							</Option>
						</Select>
					</FormItem>
					</Col>
					<Col span="11">
					<FormItem label='性别：' prop='genderId'>
						<div v-if="mode === 'view'">{{ dataToView.genderId=='M'?'男':'女' }}</div>
						<!--<Input v-else class='query-form-el' placeholder="请填写性别" type='text' v-model='dataToView.gender'></Input>-->
						<Select v-else v-model='dataToView.genderId' label-in-value @on-change="genderIdAndGender"
							class='query-form-el'>
							<Option value="M" lable="男">男</Option>
							<Option value="F" lable="女">女</Option>
						</Select>
					</FormItem>
					</Col>
				</Row>
				<Row type="flex" justify="space-around" class="code-row-bg">
					<Col span="11">
					<FormItem label='出生年月：' prop='birthDate'>
						<div v-if="mode === 'view'">{{ renderViewDate(dataToView.birthDate)}}</div>
						<DatePicker v-else class="query-form-el" placeholder="请选择出生年月" @on-change="birthDateChang"
							v-model='dataToView.birthDate'></DatePicker>
					</FormItem>
					</Col>
					<Col span="11">
					<FormItem label='年龄：' prop='age'>
						<div v-if="mode === 'view'">{{ dataToView.age }}</div>
						<InputNumber v-else class='query-form-el' :min="0" :max="110" placeholder="请填写年龄"
							v-model='dataToView.age'></InputNumber>
					</FormItem>
					</Col>
				</Row>
				<Row type="flex" justify="space-around" class="code-row-bg">
					<Col span="11">
					<FormItem label='文化程度：' prop='education'>
						<div v-if="mode === 'view'">{{ dataToView.education }}</div>
						<!--<Input v-else class='query-form-el' placeholder="请填写文化程度" type='text' v-model='dataToView.education'></Input>-->
						<Select v-else v-model='dataToView.eduId' class='query-form-el' label-in-value
							@on-change="eduIdAndEducation">
							<Option v-for="item in educations" :value="item.codingCodeId" :key="item.codingCodeId"
								:lable="item.codingName">{{item.codingName }}
							</Option>
						</Select>
					</FormItem>
					</Col>
					<Col span="11">
					<FormItem label='邮箱：'>
						<div v-if="mode === 'view'">{{ dataToView.email }}</div>
						<Input v-else class='query-form-el' placeholder="请填写邮箱" type='text'
							v-model='dataToView.email'></Input>
					</FormItem>
					</Col>
				</Row>
				<Row type="flex" justify="space-around" class="code-row-bg"
					v-show="dataToView.persitionId!='env-00003000000004'&&dataToView.persitionId!='env-00003000000005'">
					<Col span="11">
					<FormItem label='负责工作：' prop='resWorks'>
						<div v-if="mode === 'view'">
							{{ dataToView.resWork.split(',').length>1?'安全,环保' :dataToView.resWork.split(',')[0] =='1'?'安全':'环保'}}
						</div>
						<!--<Input v-else class='query-form-el' placeholder="请填写负责工作" type='text' v-model='dataToView.resWork'></Input>-->
						<Select multiple v-else v-model='dataToView.resWorks' class='query-form-el'>
							<Option value="1">安全</Option>
							<Option value="0">环保</Option>
						</Select>
					</FormItem>
					</Col>
					<Col span="11">
					<FormItem label='安全/环保工作年限：' prop='workingYears'>
						<div v-if="mode === 'view'">{{ dataToView.workingYears }}</div>
						<InputNumber v-else class='query-form-el' :min="1" placeholder="请填写安全/环保工作年限"
							v-model='dataToView.workingYears'></InputNumber>
					</FormItem>
					</Col>
				</Row>
				<Row type="flex" justify="space-around" class="code-row-bg"
					v-show="dataToView.persitionId!='env-00003000000004'&&dataToView.persitionId!='env-00003000000005'">
					<Col span="11">
					<FormItem label='专/兼职：' prop='isFullwork'>
						<div v-if="mode === 'view'">{{ dataToView.isFullwork=='1'?'专职':'兼职' }}</div>
						<!--<Input v-else class='query-form-el' placeholder="请填写专/兼职" type='text' v-model='dataToView.isFullwork'></Input>-->
						<Select v-else v-model='dataToView.isFullwork' class='query-form-el'>
							<Option value="1">专职</Option>
							<Option value="0">兼职</Option>
						</Select>
					</FormItem>
					</Col>
					<Col span="11">
					<FormItem label='职业资格证：'>
						<div v-if="mode === 'view'">{{ dataToView.careerQulifyName }}</div>
						<!-- <Input v-else class='query-form-el' placeholder="职业资格证" type='text'
                                   v-model='dataToView.careerQulify'></Input>-->
						<Select v-else clearable v-model='dataToView.careerQulify' class='query-form-el'
							@on-change="careerQulifyChange" :label-in-value="true">
							<Option v-for="item in careerQulifys" :value="item.codingCodeId" :key="item.codingCodeId"
								:lable="item.codingName">{{item.codingName }}
							</Option>
						</Select>
					</FormItem>
					</Col>
				</Row>

				<Row type="flex" justify="space-around" class="code-row-bg"
					v-show="dataToView.persitionId=='env-00003000000004'||dataToView.persitionId=='env-00003000000005'">
					<Col span="11">
					<FormItem label='负责工作：' prop='resWorks'>
						<div v-if="mode === 'view'">
							{{ dataToView.resWork.split(',').length>1?'安全,环保' :dataToView.resWork.split(',')[0] =='1'?'安全':'环保'}}
						</div>
						<!--<Input v-else class='query-form-el' placeholder="请填写负责工作" type='text' v-model='dataToView.resWork'></Input>-->
						<Select multiple v-else v-model='dataToView.resWorks' class='query-form-el'>
							<Option value="1">安全</Option>
							<Option value="0">环保</Option>
						</Select>
					</FormItem>
					</Col>
					<Col span="11">
					<FormItem label='职业资格证：'>
						<div v-if="mode === 'view'">{{ dataToView.careerQulifyName }}</div>
						<!-- <Input v-else class='query-form-el' placeholder="职业资格证" type='text'
                                    v-model='dataToView.careerQulify'></Input>-->
						<Select v-else clearable v-model='dataToView.careerQulify' class='query-form-el'
							@on-change="careerQulifyChange" :label-in-value="true">
							<Option v-for="item in careerQulifys" :value="item.codingCodeId" :key="item.codingCodeId"
								:lable="item.codingName">{{item.codingName }}
							</Option>
						</Select>
					</FormItem>
					</Col>
				</Row>
				<Row type="flex" justify="space-around" class="code-row-bg" v-show="dataToView.careerQulify!=null">
					<Col span="11">
					<FormItem label='认证时间：' prop='authenticationTime'>
						<div v-if="mode === 'view'">{{ renderViewDate(dataToView.authenticationTime) }}</div>
						<DatePicker v-else class='query-form-el' placeholder="认证时间"
							v-model='dataToView.authenticationTime'></DatePicker>
					</FormItem>
					</Col>
					<Col span="11">
					</Col>
				</Row>
				<Row type="flex" justify="space-around" class="code-row-bg" v-show="dataToView.careerQulify!=null">
					<Col span="23">
					<FormItem label='认证备注：'>
						<div v-if="mode === 'view'">{{ dataToView.authenticationNotes }}</div>
						<Input v-else class='query-form-el' placeholder="认证备注" type="textarea"
							:autosize="{minRows:2,maxRows:5}" v-model='dataToView.authenticationNotes'></Input>
					</FormItem>
					</Col>
				</Row>
			</Form>
			<Modal :transfer=false footer-hide v-model="model4" :width=900>
				<userManager :model="true" :companyId="companyId" @getSelectModelData="getSelectModelData">
				</userManager>
			</Modal>
			<div slot="footer">
				<Button v-if="mode != 'view'" type="primary" class='ivu-btn-save' @click="submit('dialogForm')">确定
				</Button>
				<Button v-if="mode != 'view'" type="primary" class='ivu-btn-cancel' @click="handleCancel">取消</Button>
				<Button v-if="mode === 'view'" class='ivu-btn-save' @click="dialogShow=false">关闭</Button>
			</div>
		</Modal>


		<Modal :transfer=false v-model="model2" :width=500 :title="!ifApproval ?'审批人选择':'审批'"
			@on-cancel="model2=false;map={}">
			<Form ref="dutyUserSelect" :rules="ifApproval ?{} :ruleCustom1" :label-width="120">
				<Row class="query-form" v-if="!ifApproval">
					<Col span="23">
					<FormItem label="审批人：" prop="approvalUserId">
						<Select ref="select" placeholder="请输入关键字查询" v-model="map.approvalUserId" filterable
							:remote-method="remoteMethod1" :loading="loading1">
							<Option v-for="(option, index) in options1" :value="option.userId" :label="option.userName"
								:key="option.userId">
								<span>{{option.userName}}</span>
								<span style="float:right;color:#ccc">{{option.orgInfo.orgName}}</span>
							</Option>
						</Select>
					</FormItem>
					</Col>
				</Row>
				<Row class="query-form" v-else>
					<Col span="23">
					<FormItem label='审批结果：'>
						<Select v-model='map.ifApproval'>
							<Option value="3">通过</Option>
							<Option value="1">退回</Option>
						</Select>
					</FormItem>
					</Col>
					<Col span="23">
					<FormItem label='审批意见：' prop="approvalMsg">
						<Input placeholder="审批意见" type="textarea" :autosize="{minRows:2,maxRows:5}"
							v-model='map.approvalMsg'></Input>
					</FormItem>
					</Col>
				</Row>
			</Form>
			<div slot="footer">
				<Button class='ivu-btn-save' :loading="buttonLoading" @click="submit1('dutyUserSelect')">确定</Button>
				<Button class='ivu-btn-cancel' @click="model2=false;map={}">取消</Button>
			</div>
		</Modal>

	</Layout>
</template>

<script>
	import {
		Api
	} from '@/api/index.js'
	var cascaderDom = () => import('@/components/cascader-dom.vue');
	import {
		sessionStorage,
		cookie
	} from '@/common/cacheUtils.js';
	import userManager from '../../base/authorityManager/userManager'
	import pageCommonFunction from '@/components/pageCommonFunction.js'
	import {
		formatDate
	} from '@/tools/index'
	export default {
		components: {
			cascaderDom,
			userManager
		},
		data() {
			return {
				...this.createCommonDataField(),
				columns1: [{
						title: '序号',
						width: 80,
						fixed: 'left',
						align: 'center',
						render: this.indexColumnsRender
					},
					{
						key: 'secGroupName',
						title: '所属二级集团',
						align: 'center',
						minWidth: 200,
					},
					{
						key: 'staffOrgName',
						title: '单位',
						align: 'center',
						minWidth: 200,
					},
					{
						key: 'userName',
						title: '人员姓名',
						align: 'center',
						minWidth: 120,
					},
					{
						key: 'persition',
						title: '职务或岗位分工',
						align: 'center',
						minWidth: 120,
					},
					{
						key: 'gender',
						title: '性别',
						align: 'center',
						minWidth: 120,
						render: (h, params) => {
							return h('span', params.row.genderId == 'M' ? '男' : '女')
						}
					},
					{
						key: 'birthDate',
						title: '出生年月',
						align: 'center',
						minWidth: 120,
						render: this.renderCellDate
					},
					{
						key: 'age',
						title: '年龄',
						align: 'center',
						minWidth: 120,
					},
					{
						key: 'education',
						title: '文化程度',
						align: 'center',
						minWidth: 120,
					},
					{
						key: 'email',
						title: '邮箱',
						align: 'center',
						minWidth: 120,
					},
					{
						key: 'resWork',
						title: '负责工作',
						align: 'center',
						minWidth: 120,
						render: (h, params) => {
							return h('span', params.row.resWork.split(',').length > 1 ? '安全,环保' : params.row.resWork.split(',')[0] == '1' ? '安全' : '环保')
						}
					},
					// {key: 'careerQulify', title: '职业资格证及取得时间', align: 'center', minWidth: 120,},
					/* {
					     key: 'isFullwork', title: '专/兼职', align: 'center', minWidth: 120, render: (h, params) => {
					         return h('span', params.row.isFullwork == '1' ? '专职' : '兼职')
					     }
					 },*/
					{
						key: 'cellPhone',
						title: '手机',
						align: 'center',
						minWidth: 120,
					},
					{
						key: 'createUserName',
						title: '创建人',
						align: 'center',
						minWidth: 120,
					},
					// {
					// 	key: 'approvalUserName',
					// 	title: '审批人',
					// 	align: 'center',
					// 	minWidth: 120,
					// },
					// {
					// 	key: 'ifApproval',
					// 	title: '审批状态',
					// 	align: 'center',
					// 	minWidth: 120,
					// 	render: (h, params) => {
					// 		return h('span', params.row.ifApproval == '0' ? '待审批' : params.row.ifApproval == '1' ?
					// 			'审批退回' : params.row.ifApproval == '3' ? '审批通过' : '待提交')
					// 	}
					// },
					// {
					// 	key: 'approvalMsg',
					// 	title: '审批意见',
					// 	align: 'center',
					// 	minWidth: 140,
					// 	tooltip: true
					// },
					{
						title: '操作',
						key: 'action',
						fixed: 'right',
						width: 180,
						align: 'center',
						render: (h, params) => {
							return h('div', [
								h('A', {
									props: {
										type: 'primary',
										size: 'small'
									},
									style: {
										fontSize: '14px',
									},
									on: {
										click: () => {
											this.viewData(params);
										}
									}
								}, '详情'),
								h('Divider', {
									props: {
										type: 'vertical'
									}
								}, ''),
								h('A', {
									props: {
										type: 'primary',
										size: 'small'
									},
									style: {
										fontSize: '14px',
										color: (params.row.createUserId == sessionStorage('userId').getObject('userId').userId ||
											this.Common.userIdList.includes(sessionStorage('userId').getObject('userId').userId) ||
 										    sessionStorage('userId').getObject('userId').userBeHandedOver.find(obj => obj == params.row.createUserId) != undefined ||
											sessionStorage('userId').getObject('userId').userRole.find(obj => obj.roleId == '73b38b37dff64392ba0ee7dd579bf293') != undefined ||
                                            params.row.approvalUserId == sessionStorage('userId').getObject('userId').userId) ? '' : '#d0d0d0',
										pointerEvents: (params.row.createUserId == sessionStorage('userId').getObject('userId').userId ||
											this.Common.userIdList.includes(sessionStorage('userId').getObject('userId').userId) ||
 											sessionStorage('userId').getObject('userId').userBeHandedOver.find(obj => obj == params.row.createUserId) != undefined ||
											sessionStorage('userId').getObject('userId').userRole.find(obj => obj.roleId == '73b38b37dff64392ba0ee7dd579bf293') != undefined ||
                                            params.row.approvalUserId == sessionStorage('userId').getObject('userId').userId) ? '' : 'none'
									},
									on: {
										click: () => {
											this.editData(params);
										}
									}
								}, '修改'),
								h('Divider', {
									props: {
										type: 'vertical'
									}
								}, ''),
								h('A', {
									props: {
										type: 'primary',
										size: 'small'
									},
									style: {
										fontSize: '14px',
										color: (params.row.createUserId == sessionStorage('userId').getObject('userId').userId ||
											this.Common.userIdList.includes(sessionStorage('userId').getObject('userId').userId) ||
											sessionStorage('userId').getObject('userId').userBeHandedOver.find(obj => obj == params.row.createUserId) != undefined ||
											sessionStorage('userId').getObject('userId').userRole.find(obj => obj.roleId == '73b38b37dff64392ba0ee7dd579bf293') != undefined ||
											params.row.approvalUserId == sessionStorage('userId').getObject('userId').userId) ? 'red' : '#d0d0d0',
										pointerEvents:  (params.row.createUserId == sessionStorage('userId').getObject('userId').userId ||
											this.Common.userIdList.includes(sessionStorage('userId').getObject('userId').userId) ||
											sessionStorage('userId').getObject('userId').userBeHandedOver.find(obj => obj == params.row.createUserId) != undefined ||
                                            sessionStorage('userId').getObject('userId').userRole.find(obj => obj.roleId == '73b38b37dff64392ba0ee7dd579bf293') != undefined ||
											params.row.approvalUserId == sessionStorage('userId').getObject('userId').userId) ? '' : 'none'
									},
									on: {
										click: () => {
											this.deleteData(params);
										}
									}
								}, '删除'),
							// 	h('Divider', {
							// 		props: {
							// 			type: 'vertical'
							// 		}
							// 	}, ''),
							// 	h('A', {
							// 		props: {
							// 			type: 'primary',
							// 			size: 'small'
							// 		},
							// 		style: {
							// 			fontSize: '14px',
							// 			color: (params.row.ifApproval == '2' || params.row
							// 				.ifApproval == '1') && (params.row.createUserId ==
							// 				sessionStorage('userId').getObject('userId').userId ||
							// 				this.Common.userIdList.includes(sessionStorage(
							// 					'userId').getObject('userId').userId) ||
							// 				sessionStorage('userId').getObject('userId').userRole
							// 				.find(obj => obj.roleId ==
							// 					'73b38b37dff64392ba0ee7dd579bf293') != undefined ||
							// 				params.row.approvalUserId == sessionStorage('userId')
							// 				.getObject('userId').userId) ? '' : '#d0d0d0',
							// 			pointerEvents: (params.row.ifApproval == '2' || params.row
							// 				.ifApproval == '1') && (params.row.createUserId ==
							// 				sessionStorage('userId').getObject('userId').userId ||
							// 				this.Common.userIdList.includes(sessionStorage(
							// 					'userId').getObject('userId').userId) |
							// 				sessionStorage('userId').getObject('userId').userRole
							// 				.find(obj => obj.roleId ==
							// 					'73b38b37dff64392ba0ee7dd579bf293') != undefined ||
							// 				params.row.approvalUserId == sessionStorage('userId')
							// 				.getObject('userId').userId) ? '' : 'none'
							// 		},
							// 		on: {
							// 			click: () => {
							// 				this.map = {
							// 					staffId: params.row.staffId,
							// 					approvalUserId: null,
							// 					approvalMsg: null,
							// 					ifApproval: '0'
							// 				}
							// 				this.model2 = true
							// 				this.ifApproval = false
							// 			}
							// 		}
							// 	}, '审批申请'),
							// 	h('Divider', {
							// 		props: {
							// 			type: 'vertical'
							// 		}
							// 	}, ''),
							// 	h('A', {
							// 		props: {
							// 			type: 'primary',
							// 			size: 'small'
							// 		},
							// 		style: {
							// 			fontSize: '14px',
							// 			color: params.row.ifApproval == '0' && (this.Common.userIdList
							// 				.includes(sessionStorage('userId').getObject('userId')
							// 					.userId) || sessionStorage('userId').getObject(
							// 					'userId').userRole.find(obj => obj.roleId ==
							// 					'73b38b37dff64392ba0ee7dd579bf293') != undefined ||
							// 				params.row.approvalUserId == sessionStorage('userId')
							// 				.getObject('userId').userId) ? '' : '#d0d0d0',
							// 			pointerEvents: params.row.ifApproval == '0' && (this.Common
							// 					.userIdList.includes(sessionStorage('userId')
							// 						.getObject('userId').userId) | sessionStorage(
							// 						'userId').getObject('userId').userRole.find(obj =>
							// 						obj.roleId == '73b38b37dff64392ba0ee7dd579bf293'
							// 						) != undefined || params.row.approvalUserId ==
							// 					sessionStorage('userId').getObject('userId').userId) ?
							// 				'' : 'none'
							// 		},
							// 		on: {
							// 			click: () => {
							// 				this.map = {
							// 					staffId: params.row.staffId,
							// 					ifApproval: '3',
							// 					approvalMsg: null,
							// 					createUserId: params.row.createUserId
							// 				}
							// 				this.model2 = true
							// 				this.ifApproval = true
							// 			}
							// 		}
							// 	}, '审批')
							])
						}
					}
				],
				ruleCustom: {
					secGroup: [{
						validator: (rule, value, callback) => {
							if (value == null || value == '' || value == undefined) {
								callback(' ')
							} else {
								callback()
							}
						},
						required: true,
						trigger: 'change'
					}],
					staffOrgName: [{
						required: true,
						message: '请填写单位',
						trigger: 'change',
					}],
					userName: [{
						required: true,
						message: '请填写人员',
						trigger: 'change',
					}],
					persition: [{
						required: true,
						message: '请填写职务或岗位分工',
						trigger: 'change',
					}],
					genderId: [{
						required: true,
						message: '请填写性别',
						trigger: 'change',
					}],
					birthDate: [{
						required: true,
						message: '请填写出生年月',
						trigger: 'change',
						type: 'date'
					}],
					age: [{
						pattern: /^([0-9][0-9]*)+(.[0-9]{1,4})?$/,
						required: true,
						message: ' ',
						trigger: 'change',
					}],
					workingYears: [{
						validator: (rule, value, callback) => {
							if (this.dataToView.persitionId != 'env-00003000000004' && this.dataToView
								.persitionId != 'env-00003000000005') {
								if (value == null || value == '' || value == undefined) {
									callback(' ')
								} else {
									callback()
								}
							} else {
								callback()
							}
						},
						required: true,
						trigger: 'change'
					}],
					education: [{
						required: true,
						message: '请填写文化程度',
						trigger: 'change',
					}],
					/* /^[A-Za-z\d]+([-_.][A-Za-z\d]+)*@([A-Za-z\d]+[-.])+[A-Za-z\d]{2,4}$/*/
					email: [{
							validator: (rule, value, callback) => {
								if (!(/(?=.*[0-9])(?=.*[a-zA-Z])(?=.*[^a-zA-Z0-9]).{15,30}/.test(this.dataToView
										.email))) {
									callback(' ');
								} else {
									callback()
								}
							},
							required: true,
							trigger: 'blur'
						}
						/* {required: true, message: '请填写邮箱', trigger: 'change',},
						 {
						     pattern:  /(?=.*[0-9])(?=.*[a-zA-Z])(?=.*[^a-zA-Z0-9]).{15,30}/,
						     message: '请输入正确的邮件格式',
						     trigger: 'change'
						 }*/
					],
					resWorks: [{
						validator: (rule, value, callback) => {
							if ((value == null || value == '' || value == undefined) && this.dataToView
								.resWorks.length < 1) {
								callback(' ')
							} else {
								callback()
							}
						},
						required: true,
						trigger: 'change'
					}],
					// careerQulify: [{required: true, message: '请选择职业资格认证', trigger: 'change',}],
					authenticationTime: [{
						validator: (rule, value, callback) => {
							if (this.dataToView.careerQulify != null && (value == null || value == '' ||
									value == undefined)) {
								callback(' ')
							} else {
								callback()
							}
						},
						required: true,
						trigger: 'change'
					}],
					isFullwork: [{
						validator: (rule, value, callback) => {
							if (this.dataToView.persitionId != 'env-00003000000004' && this.dataToView
								.persitionId != 'env-00003000000005') {
								if (value == null || value == '' || value == undefined) {
									callback(' ')
								} else {
									callback()
								}
							} else {
								callback()
							}
						},
						required: true,
						trigger: 'change'
					}],
					cellPhone: [{
						validator: (rule, value, callback) => {
							if (!(/^1[3456789]\d{9}$/.test(this.dataToView.cellPhone))) {
								callback(' ');
								// this.$Message.error("请填写有效的的手机号")
							} else {
								callback()
							}
						},
						required: true,
						trigger: 'blur'
					}],
				},
				tableHeight: 10,
				persitionIds: [],
				educations: [],
				model4: false,
				secGroupNames: [],
				careerQulifys: [],
				companyId: '',
				buttonLoading: false,
				// api
				queryUrl: Api.querySaStaffEnvinfo,
				deleteUrl: Api.deleteSaStaffEnvinfo,
				updateUrl: Api.updateSaStaffEnvinfo,
				saveUrl: Api.saveSaStaffEnvinfo,

				ruleCustom1: {
					approvalUserId: [{
						validator: (rule, value, callback) => {
							if (this.map.approvalUserId == null || this.map.approvalUserId == undefined || this
								.map.approvalUserId == '') {
								callback('审批人不能为空')
							} else {
								callback()
							}
						},
						required: true,
						trigger: 'change'
					}],
					approvalMsg: [{
						validator: (rule, value, callback) => {
							if (this.map.ifApproval == '1' && (this.map.approvalMsg == null || this.map
									.approvalMsg == undefined || this.map.approvalMsg == '')) {
								callback('意见不能为空')
							} else {
								callback()
							}
						},
						required: true,
						trigger: 'change'
					}],
				},
				loading1: false,
				model2: false,
				options1: [],
				map: {},
                ifApproval:false
			}
		},
		mounted() {
			this.companyId = sessionStorage('userId').getObject('userId').companyId
			this.tableHeight = window.innerHeight - this.$refs.table.$el.offsetTop - 145;
			this.query();
			// this.selectSecGroupNames()
			let _this = this
			this.gDic(Api.queryCodeDetailBySortId + "/env-00003", function(result) {
				_this.persitionIds = result;
			});
			this.gDic(Api.queryCodeDetailBySortId + "/1000001032", function(result) {
				_this.educations = result;
			});
			this.gDic(Api.queryCodeDetailBySortId + "/env-00004", function(result) {
				_this.careerQulifys = result;
			});
		},
		methods: {
			...pageCommonFunction,
			downloadFile() {
				this.buttonLoading = true
				let resWorksList = "";
				let eduIdsList = "";
				let isFullworksList = "";
				let persitionIdsList = "";
				if (this.dataToQuery.resWorks != null && this.dataToQuery.resWorks != undefined && this.dataToQuery
					.resWorks.length > 0) {
					for (var i = 0, len = this.dataToQuery.resWorks.length; i < len; i++) {
						resWorksList += this.dataToQuery.resWorks[i] + ",";
					}
				}
				if (this.dataToQuery.eduIds != null && this.dataToQuery.eduIds != undefined && this.dataToQuery.eduIds
					.length > 0) {
					for (var i = 0, len = this.dataToQuery.eduIds.length; i < len; i++) {
						eduIdsList += this.dataToQuery.eduIds[i] + ",";
					}
				}
				if (this.dataToQuery.isFullworks != null && this.dataToQuery.isFullworks != undefined && this.dataToQuery
					.isFullworks.length > 0) {
					for (var i = 0, len = this.dataToQuery.isFullworks.length; i < len; i++) {
						isFullworksList += this.dataToQuery.isFullworks[i] + ",";
					}
				}
				if (this.dataToQuery.persitionIds != null && this.dataToQuery.persitionIds != undefined && this.dataToQuery
					.persitionIds.length > 0) {
					for (var i = 0, len = this.dataToQuery.persitionIds.length; i < len; i++) {
						persitionIdsList += this.dataToQuery.persitionIds[i] + ",";
					}
				}
				if (this.dataToQuery.companyId != null && this.dataToQuery.companyId != undefined && this.dataToQuery
					.companyId != '') {
					this.dataToQuery.orgId = this.dataToQuery.companyId
				} else {
					this.dataToQuery.orgId = sessionStorage('userId').getObject('userId').companyId
				}
				let orgId = sessionStorage('userId').getObject('userId').companyId
				let data = {
					orgId: orgId,
					resWorksList: resWorksList,
					eduIdsList: eduIdsList,
					isFullworksList: isFullworksList,
					persitionIdsList: persitionIdsList
				};
				data = Object.assign(data, JSON.parse(JSON.stringify(this.dataToQuery)));
				this.$http.get(Api.downloadSaStaffEnvinfo, {
					params: data,
					responseType: 'blob' //告诉服务器我们需要的响应格式
				}).then((res) => {
					const aLink = document.createElement("a");
					let blob = new Blob([res.data], {
						type: res.bodyBlob.type //将会被放入到blob中的数组内容的MIME类型
					});
					aLink.href = URL.createObjectURL(blob)
					aLink.download = "安全环保管理人员信息表(" + formatDate(new Date(), "yyyy-MM-dd") + ").xlsx" //标题
					aLink.click()
					document.body.appendChild(aLink)
					this.buttonLoading = false
				})
			},
			submit1(name) {
				this.$refs[name].validate((valid) => {
					if (valid) {
						this.buttonLoading = true
						let url = this.updateUrl
						this.$http.put(url, this.map).then((res) => {
							this.$Message.success('成功');
							this.model2 = false
							this.buttonLoading = false
							this.query()
						}).catch(e => {
							this.$Message.error('请求失败');
							this.buttonLoading = false
						})
					} else {
						this.$Message.error('责任人不能为空!');
					}
				})
			},
			remoteMethod1(query) {
				if (this.map.approvalUserId == query) {
					return;
				}
				if (query !== '') {
					clearTimeout(this.remoteMethod1.timer);
					this.remoteMethod1.timer = setTimeout(() => {
						this.loading1 = true;
						let data = {
							userName: query,
							orgId: sessionStorage('userId').getObject('userId').companyId
						};
						this.$http.get(Api.queryUserByUserName, {
							params: data
						}).then((res) => {
							this.loading1 = false;
							this.options1 = res.data.data;
						}).catch(e => {
							this.loading1 = false;
						})
					}, 200);
				} else {
					this.options1 = [];
				}
			},
			deleteData(params) {
				params.row.id = params.row.staffId
				this.deleteDateAjax(params);
			},
			query() {
				if (this.dataToQuery.resWorks != null && this.dataToQuery.resWorks != undefined && this.dataToQuery
					.resWorks.length < 1) {
					this.dataToQuery.resWorks = null
				}
				if (this.dataToQuery.eduIds != null && this.dataToQuery.eduIds != undefined && this.dataToQuery.eduIds
					.length < 1) {
					this.dataToQuery.eduIds = null
				}
				if (this.dataToQuery.isFullworks != null && this.dataToQuery.isFullworks != undefined && this.dataToQuery
					.isFullworks.length < 1) {
					this.dataToQuery.isFullworks = null
				}
				if (this.dataToQuery.persitionIds != null && this.dataToQuery.persitionIds != undefined && this.dataToQuery
					.persitionIds.length < 1) {
					this.dataToQuery.persitionIds = null
				}
				if (this.dataToQuery.companyId != null && this.dataToQuery.companyId != undefined && this.dataToQuery
					.companyId != '') {
					this.dataToQuery.orgId = this.dataToQuery.companyId
				} else {
					this.dataToQuery.orgId = sessionStorage('userId').getObject('userId').companyId
				}
        this.dataToQuery.userId = sessionStorage('userId').getObject('userId').userId
				this.queryAjax();
				this.$emit("refreshNotice");
			},
			careerQulifyChange(e) {
				this.dataToView.careerQulify = e.value;
				this.dataToView.careerQulifyName = e.label;
			},
			submit(name) {
				this.dataToView.resWork = this.dataToView.resWorks.join(',')
				if (this.dataToView.careerQulify == null) {
					this.dataToView.authenticationTime = null
				}
				this.submitAjax(name);
			},
			async beforeEditDialogOpen(data) {
				data.row.resWorks = data.row.resWork.split(',')
			},
			createEmptyDataToAdd() {
				return {
					ifApproval: '2',
					careerQulify: null,
					// staffOrgId: sessionStorage('userId').getObject('userId').companyId,
					// staffOrgName: sessionStorage('userId').getObject('userId').companyName,
					age: null,
					workingYears: null,
					resWorks: [],
					secGroup: sessionStorage('userId').getObject('userId').twoLevelOrgId,
					secGroupName: sessionStorage('userId').getObject('userId').twoLevelOrgName,

				}
			},
			birthDateChang(date) {
				let newDate = new Date().getTime() - new Date(date).getTime()
				let age = Math.floor(newDate / 1000 / 60 / 60 / 24 / 365);
				if (!isNaN(age)) {
					this.dataToView.age = age
				}
				this.dialogShow = true;
			},
			eduIdAndEducation(value) {
				this.dataToView.education = value.label
				this.dataToView.eduId = value.value
			},
			persitionIdAndPersition(value) {
				this.dataToView.persition = value.label
				this.dataToView.persitionId = value.value
			},
			genderIdAndGender(value) {
				this.dataToView.gender = value.label
				this.dataToView.genderId = value.value
			},
			getSelectModelData(row) {
				this.dataToView.userId = row.userId;
				this.dataToView.userName = row.userName;
				this.dataToView.cellPhone = row.mobileNumber;
				this.dataToView.email = row.email;
				this.dataToView.genderId = row.sex;
				this.model4 = false;
			},
			setOrgId(data) {
				this.dataToQuery.companyId = data[data.length - 1];
			},
			setOrgName(data) {
				this.dataToQuery.orgName = data;
			},
		},
		computed: {},

	}
</script>

<style lang='css' scoped>
	@import '../../../index.css';
</style>
